<!-- 雷达图配置 -->
<template>
  <div style="border-bottom: 1px solid #373838;">
    <el-collapse-item :title="$t('雷达图')" name="3">
      <el-form-item :label="$t('字体')" class="form_item_margin">
        <span class="l_color_box r_margin_right8">
          <l-input-color
            v-model="myConfig.radarNameColor"
            :notInput="true"
          ></l-input-color>
        </span>
        <el-input
          v-model="myConfig.radarNameColor"
          class="r_96width r_margin_right8"
        >
        </el-input>
        <el-input
          v-model="myConfig.radarNameSize"
          class="r_56width"
          oninput="value=value.replace(/[^\d]/g,'')"
        >
          <span slot="suffix" style="line-height: 32px">px</span>
        </el-input>
      </el-form-item>
      <el-form-item label="透明度">
        <el-slider
          v-model="myConfig.areaOpacity"
          class="slider136 r_margin_right8"
          :show-tooltip="false"
        >
        </el-slider>
        <el-input
          v-model.number="myConfig.areaOpacity"
          class="r_56width"
          oninput="value=value.replace(/[^\d]/g,'')"
        >
          <span slot="suffix" style="line-height: 32px">%</span>
        </el-input>
      </el-form-item>
      <el-form-item :label="$t('半径大小')">
        <el-slider
          v-model="myConfig.radius"
          class="slider136 r_margin_right8"
          :show-tooltip="false"
        />
        <el-input
          v-model.number="myConfig.radius"
          class="r_56width"
          oninput="value=value.replace(/[^\d]/g,'')"
        >
          <span slot="suffix" style="line-height: 32px">%</span>
        </el-input>
      </el-form-item>
      <el-form-item :label="$t('标记形状')">
        <l-select v-model="myConfig.symbol" :options="dicOption.iconOptions" />
      </el-form-item>
      <el-form-item :label="$t('区域填充')">
        <el-switch v-model="myConfig.isArea" class="float_right" />
      </el-form-item>
    </el-collapse-item>
  </div>
</template>

<script>
import { dicOption } from "../../mixins/config";
export default {
  props: {
    config: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      dicOption: dicOption,
    };
  },
  computed: {
    myConfig() {
      return this.config;
    },
  },
};
</script>

<style>
</style>